<template>
  <div>
    <van-nav-bar
      class="link"
      title="房屋管理"
      left-arrow
      @click-left="$router.go(-1)"
    />
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <HouseItem
        v-for="item in list"
        :key="item.houseCode"
        :item="item"
      ></HouseItem>
    </van-list>
  </div>
<!-- http://121.199.51.160:8080/newImg/img1 -->
</template>
<script>
import HouseItem from './HouseItem.vue'
import { getMyRental } from '@/api/user'
export default {
  // name: 'myrent-page',
  components: { HouseItem },
  data () {
    return {
      list: [],
      page: 1,
      pageSize: 10,
      loading: false,
      finished: false
    }
  },
  methods: {
    async onLoad () {
      const res = await getMyRental()
      console.log(res)
      this.loading = false
      this.list.push(...res.body)
      this.finished = true
      // 判断没有数据了 显示没有更多
      if (this.length === res.body.length) {
        this.finished = true
      }
    }
  }
}
</script>

<style lang="less" scoped>
.link {
  background-color: #21b97a;
}
::v-deep .van-nav-bar__title,
.van-ellipsis {
  color: #fff;
  font-size: 18px;
  font-weight: 400;
}
::v-deep .van-icon,
.van-icon-arrow-left,
.van-nav-bar__arrow {
  color: #fff;
}
</style>
